<template>
    <div>
<van-nav-bar
  title="账号登录"
   left-arrow
   @click-left="onClickLeft"
/>
<van-form @submit="onSubmit">
  <van-field
    v-model="username"
    name="username"
    label="用户名"
    placeholder="用户名"
    :rules="[{ required: true, message: '请输入账号' },
    { pattern: /^\w{5,}$/, message: '用户名至少包含5个字符'}]"
  />
  <van-field
    v-model="password"
    type="password"
    name="password"
    label="密码"
    placeholder="密码"
    :rules="[{ required: true, message: '请填写密码' },

   { pattern: /^\w{6,}$/, message: '密码至少包含6个字符' }
    ]"
  />
  <div style="margin: 16px;">
    <van-button square block type="primary" native-type="submit">登录</van-button>
  </div>
</van-form>
    </div>
</template>

<script>
import request from '@/utils/request';
export default {
  name:"DEV",
    props: {

    },
    data() {
        return {
username:"",
password:""
        };
    },
    computed: {

    },
    created() {

    },
    mounted() {

    },
    watch: {

    },
    methods: {
      onClickLeft(){
        this.$router.push({
          path:"/details"
        })
      },
async onSubmit (values) {
      console.log(values)
   const {data}= await request({
        url:"/user/login",
        method:"POST",
   data:{
       username:"hzhmqd",
       password:"123456"
     }
      })
      console.log(data);
       this.$router.push({
          path:"/layout/myde"
        })
    
    }
    },
    components: {

    },
};
</script>

<style scoped lang="less">
// .van-nav-bar__content{
//   background-color: "#4bb979";
// }
.van-icon van-icon-arrow-left van-nav-bar__arrow{
  color:#ffffff;
      fill: currentColor;
}
.van-nav-bar__title van-ellipsis{
  color:#ffffff;
      font-size: 18px;
}
</style>
